(function (angular) {
	var app = angular.module('app',['service']);

	app.controller('AppCtrl',[
		'$scope'
		,'$myServ'
		,'$location'
		,function($scope,$myServ,$location){
			//功能1：得到数据库中的数据 渲染到页面中
			//利用module层从数据库得到数据
			//在controller层和view层进行数据渲染
			//得到module层数据  传给页面中
			$scope.todos = $myServ.get();
			/****************功能1完成*******************/

			//功能2：可以在页面中添加数据
			//controller层在页面中建立数据双向绑定，每次提交时得到输入的新todo
			$scope.newTodo = '';
			//建立提交事件 add  触发数据交互
			$scope.add = function(){
				//如果数据没有内容 则返回
				if(!/\S+/.test($scope.newTodo)){
					return ;
				}
				$myServ.add($scope.newTodo);
				$scope.newTodo = '';
			};
			/****************功能2完成*****************/

			//功能3 可以进行数据删除
			//view层绑定删除事件  得到该结构的id传给module层进行数据处理
			$scope.remove = function(id){
				$myServ.remove(id);
			};
			/******************功能3完成*******************/

			//功能4：内容可以进行编辑
			//view层中建立双击事件，让对应项的样式变为编辑状态，ng-class逻辑切换类名，提交后和module层交互数据
			//因为每次只有一个内容进行编辑 ，所以建立一个isEditingId，view层ng-class判断，如果本id等于isEditingId就让其有editing类名，如果没有，就让其回归显示状态
			//建立编辑事件   view层进行双击事件时把对应的id发给controller层 controller层把isEditingId改为对应的id
			
			$scope.isEditingId = -1;
			$scope.edit = function(id){
				$scope.isEditingId = id;
			};


			//建立提交事件  提交后controller层把数据提交给module层，isEditingId重置
			$scope.save = function(){
				//因为编辑内容和显示内容数据双向绑定，显示内容和module层闭包数据双向绑定，所有只需把闭包数据更新到数据库中即可
				$myServ.save();
				$scope.isEditingId = -1;
			};
			/*************功能4完成******************/	

			//功能5：对应每一项使用 completed样式
			//view层中的li ng-class中添加completed的类名判定 和v.completed绑定
			//view层中点击完成时  让checkbox的值和v.completed进行双向绑定 
			//view层中在点击状态发生改变时，触发事件让controller层调用module层的保存
			$scope.statusChange = function(){
				$myServ.save();
			};
			/**************功能5完成**********************/

			//功能6：批量状态设置
			//view层设置事件  在状态改变时  双向绑定记录状态 ，把状态传给module层
			$scope.selectAll = false;
			$scope.all = function(){
				$myServ.all($scope.selectAll);
			};
			/******************功能6 完成*****************/

			//功能7：记录active的项目数
			//得到module层中数目
			//利用单项绑定和view层进行绑定
			$scope.getActive = function(){
				return $myServ.getActive();
			};

			//功能8：在点击clear时清除已完成项目
			//view层建立事件  ng-click
			//controller层进行转接  到module层
			$scope.clear = function(){
				$myServ.clear();
			};
			/****************功能8完成***************/

			//功能9：状态切换  
			//view层在数组渲染前进行过滤  默认为不过滤  在不同状态时使用不同的过滤
			//初始状态
			$scope.filterComp = {};
			//根据过滤器的属性对不同的标签的样式赋值不同的类名
			//view层建立点击不同的按钮 换不同的锚点
			//监视  $watch只能对$scope 上的内容进行监视  变量 或方法的返回值
			//利用系统的$location管理路由
			$scope.loca = $location;
			$scope.$watch('loca.hash()',function(now){
				switch(now){
					case '/':
						$scope.filterComp.completed = undefined;
						break;
					case '/active':
						$scope.filterComp.completed = false;
						break;
					case '/completed':
						$scope.filterComp.completed = true;
						break;
				}
			});

	}]);







	//功能4ux增强
	//建立得到焦点指令
	app.directive('autoFocus',['$timeout',function($timeout){
		return {
			restrict:'A',
			scope:{
				focus:'@'
			},
			link:function(scope,element,attrs){
				scope.$watch('focus',function(now){
					if(now){
						$timeout(function(){
							element[0].focus();
						});
					}
				});
			}
		};



	}]);




})(angular);
